<template>

  <div style="">
    <van-nav-bar title="充电中" left-text="返回" left-arrow @click-left="onClickLeft" />
  </div>

  <div style="margin-top: 40px;text-align: center;">
    <van-circle v-model:current-rate="currentRate" :rate=chargingRate :speed="100" :text="text"></van-circle>
  </div>
  <van-loading vertical>
    <template #icon>
      <van-icon name="star" size="30" />
    </template>
  </van-loading>
  <div class="foot-div">
    <span><van-button round type="success" size="normal" @click="startCharging()">结束充电</van-button></span>
  </div>

</template>
<script setup>
import { ref, computed, onMounted } from 'vue'
import { useRoute } from 'vue-router'
import router from '@/router'
import { CoreGunStatus } from '@/api/core';

// 假设你有一个解密函数
function decryptData(data) {
  return JSON.parse(atob(data)); // 简单的 base64 解码示例
}

const route = useRoute();
const encryptedParams = route.query.data; // 获取加密的参数
var chargingRate = ref('')


function chargeRecord(){
if (encryptedParams) {
  const decryptedParams = decryptData(encryptedParams); // 解密参数
  console.log(decryptedParams); // 打印解密后的参数以供调试

  chargingRate.value = decryptedParams.batteryCapacityStart/(decryptedParams.batteryCapacityStart+decryptedParams.batteryCapacity)*100
  // 你可以在这里使用解密后的参数
}
}
chargeRecord()

let isRunning = ref(true); // 控制定时器的标志
let interval; // 定义 interval 变量

// 启动定时器
function startTimer() {
  interval = setInterval(() => {
    if (!isRunning.value) {
      clearInterval(interval); // 终止定时器
      console.log("定时器已停止");
      return;
    }
    chargingRate.value = chargingRate.value + 1
    if(chargingRate.value >= 100){
      clearInterval(interval); // 终止定时器
      return;
    }
    console.log("这是一个定时器，每5秒输出一次");
  }, 5000); // 每5000毫秒（5秒）输出一次
}

// 启动定时器
onMounted(() => {
  startTimer(); // 确保只在组件挂载时调用一次
});

const stopTimer = () => {
  isRunning.value = false; // 设置标志为 false，结束定时器
  console.log("停止定时器按钮被点击，isRunning.value:", isRunning.value); // 调试输出
}
const chargingRateEnd = ref(0)
// 示例按钮
const startCharging = () => {
  stopTimer(); // 停止定时器
  // 跳转到去支付页面
  const decryptedParams = decryptData(encryptedParams); // 解密参数

  chargingRateEnd.value = (chargingRate.value/100)*(decryptedParams.batteryCapacity+decryptedParams.batteryCapacityStart)
  console.log(chargingRateEnd.value)

  
  CoreGunStatus(decryptedParams).then(res => {
    if(res.data.code==200){
      router.push({
        path: '/charging/finish',
        query: {
          id: decryptedParams.id,
          price: decryptedParams.price,
          chargingRateEnd: chargingRateEnd.value,
          chargingRateStart: decryptedParams.batteryCapacityStart,
          vehicleIdentifyNo:decryptedParams.vehicleIdentifyNo
        }
      });
    }
  });

}
var currentRate = ref(0);
var text = computed(() => currentRate.value.toFixed(0) + '%');

const onClickLeft = () => history.back();
</script>
<style>
.main-div {
  margin: 8px;
  height: 65px;
  width: auto;
  display: flex;
  border-radius: 2%;
  background-color: gray;
}

image {
  border-width: 0px;
  position: absolute;
  left: 0px;
  top: 0px;
}

.foot-div {
  margin-top: 100px;
  text-align: center;
}
</style>